<style>
	
	.chisha {
		left: 50%;
	
    position: absolute;
    top: 50%;
    
    margin-top: -150px; /* 盒子本身高度的一半 */
    margin-left: -250px; /* 盒子本身高度的一半 */
  
   text-align: center;

	}
	#sha{
		font-size: 30px;
		color: red;
		font-weight: bold;
		font-family: sans-serif;
	}
	#gaogaochi{
			border: 1px solid;
			height: 300px;
			width: 500px;
			text-align: center;
			line-height: 300px;
	}

</style>

<div class="chisha">
<h1>高高的吃啥网</h1>
<button style="margin-top: 10px;margin-bottom: 10px;width: 60px;" id="start_or_stop">开始</button>
 <div id="gaogaochi">
	<span id="sha">汉堡包</span>
</div>
</div>


<script type="text/javascript">
	
function random(lower, upper) {
	return Math.floor(Math.random() * (upper - lower+1)) + lower;
}  
	var dongxi = ['汉堡包','食堂','黄焖鸡','板面','炒面','盖浇饭'];
	interval = null;
	$('#start_or_stop').click(function(){
		
		if($(this).text() == '开始'){
			interval = setInterval(function(){
				var num = random(0,dongxi.length-1);
				$('#sha').text(dongxi[num]);
			},100)
			$(this).text('停止');
		}else{
			clearInterval(interval);
			$(this).text('开始');
		}

	})
</script>


